import React from "react";
import {  Button } from "antd";
import { connect } from "dva";
import { localUrl } from "../../utils/index";

// function getBase64(img, callback) {
//   const reader = new FileReader();
//   reader.addEventListener("load", () => callback(reader.result));
//   reader.readAsDataURL(img);
// }

// function beforeUpload(file) {
//   const isJPG = file.type === "image/jpeg";
//   const isPNG = file.type === "image/png";
//   if (!isJPG && !isPNG) {
//     message.error("图片格式不正确");
//   }
//   const isLt2M = file.size / 1024 / 1024 < 2;
//   if (!isLt2M) {
//     message.error("图片大小不能超过2M");
//   }
//   if (isJPG) {
//     return isJPG && isLt2M;
//   } else {
//     return isPNG && isLt2M;
//   }
// }

@connect(({ add }) => ({
  add: add
}))
class Uploads extends React.Component {
  state = {
    loading: false,
    imageUrl: `${localUrl}/public/static/ueditor/default.png`
  };
  componentDidMount() {
    //订阅  从内容库选择
    window.PubSub.subscribe("bannerImg", this.setBannerImg);
  }
  static getDerivedStateFromProps(nextProps, prevState) {
    if (nextProps.img) {
      return { imageUrl: nextProps.img };
    }
    if (nextProps.add.articleData.length > 0) {
      if (nextProps.add.articleData[0].data) {
        let imageUrl = nextProps.add.articleData[0].data.video_img;
        return { imageUrl };
      }
    }
    return null;
  }

  //订阅
  setBannerImg = data => {
    if (data.type === "biz_sobey_picture") {
      this.setState({
        imageUrl: data.keyFrameUrl
      });
      this.props.form.setFieldsValue({
        information_img: data.keyFrameUrl
      });
    }
  };
  /**
   * 从内容库选择
   */
  fromContent = () => {
    if (window.bar) {
      window.bar.show("picture", "ggsc"); //图片
      this.props.dispatch({ type: "add/saveMchType", data: "bannerImg" });
    }
  };

  /**
   * 上传插件
   */
  fcUpload = key => {
    window.fc = new window.FcUpload({
      elem: "fcUpload",
      multiple: false, //是否允许上传多个文件
      type: "img", // 上传文件类型\ img 图片，  video 视频
      host:localUrl,
      actionImg: `${localUrl}/fcpublic/uploads/uploadImg`, //本地上传图片地址
      actionVideo: `${localUrl}/fcpublic/uploads/uploadVideo`, //本地上传视频地址
      callback: callRes => {
        let url;
        if (callRes.oss) {
          // oss 和本地返回数据结构不一样
          url = callRes.response[0];
        } else {
          url = callRes.response[0].data;
        }
        this.props.form.setFieldsValue({
          information_img: url
        });
        this.setState({
          imageUrl: url
        });
        setTimeout(function() {
          document.getElementById("uploads-img").setAttribute("src", url);
        }, 300);
      }
    });

    window.fc.show();
  };

  render() {
    const imageUrl = this.state.imageUrl;

    return (
      <div>
        <img onClick={this.fcUpload} src={imageUrl} width="279px" height="149px" id="uploads-img" />
        {this.props.add.configJson.mchSwitch ? <Button onClick={this.fromContent}>从内容库选择</Button> : ""}
      </div>
    );
  }
}
export default Uploads;
